<template>
  <el-scrollbar>
    <el-menu :default-active="active" @select="handleSelect">
      <!-- <el-menu-item index="idx">我的。。。</el-menu-item> -->

      <el-menu-item-group>
        <template #title>资源自定义</template>
        <el-menu-item index="mysite" @click="route.push('/u/mysite')">我的站点</el-menu-item>
        <el-menu-item index="addsite">新增配置</el-menu-item>
      </el-menu-item-group>

      <el-menu-item-group title="展示页自定义">
        <!-- <el-menu-item index="home">首页</el-menu-item> -->
        <el-menu-item index="customize">个性化</el-menu-item>
      </el-menu-item-group>
    </el-menu>
  </el-scrollbar>
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'

const route = useRouter()

const active: any = ref('mysited')
const handleSelect = (key: string, keyPath: string[]) => {
  route.push('/u/' + key)
  console.log(key)
}

const test = () => {
  console.log('router', route)
}

onMounted(() => {
  //当前路由路径名称
  console.log('当前路由路径名称', route.currentRoute.value.name)
  active.value = route.currentRoute.value.name
})
</script>

<style></style>
